<template>
  <div id="app">
    <ElConfigProvider :locale="zhCn">
      <router-view />
    </ElConfigProvider>
  </div>
</template>

<script setup lang="ts">
import zhCn from 'element-plus/es/locale/lang/zh-cn'

import { onMounted } from 'vue';
import { useThemeStore } from './store/theme';
import { logo } from './apis/currency';
import { useCoinStore } from './store/coin';
import { listTradingOn } from '@/apis/cct';
onMounted(() => {
  listTradingOn().then(res => {
    useCoinStore().setCoinPriceList(res as [])
  })
  useThemeStore().setTheme(useThemeStore().theme)
  logo().then(res => {
    useCoinStore().setLogoList(res as [])
  })
})
</script>

<style>
:root {
  --el-color-primary: #0ea5e9;
  --el-disabled-bg-color: #ededed;
}

.el-notification {
  padding: 14px 16px 14px 0 !important
}

@font-face {
  font-family: "my";
  src: url(./assets/font.ttf) format(truetype);
  font-style: normal;
  font-weight: normal;
}

.icon {
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
}

* {
  padding: 0;
  margin: 0;
  font-family: PingFang SC, PingFang SC;
  /* font-family: "my", Roboto; */
}

* {
  -webkit-tap-highlight-color: transparent;
  tap-highlight-color: transparent;
}

/* globals.css - 全局样式文件，无 scoped */
/* 全局默认隐藏滚动条（所有元素） */
*::-webkit-scrollbar {
  display: none;
  /* Chrome/Safari/Edge */
}

* {
  -ms-overflow-style: none;
  /* IE/Edge 旧版本 */
  scrollbar-width: none;
  /* Firefox */
}

html.dark {
  /* 自定义深色背景颜色 */
  --el-bg-color-overlay: #2a313d;
  --el-bg-color: #202630;
  --el-disabled-bg-color: #343b47;


}

html .dark .el-slider {
  --el-slider-runway-bg-color: #434c5a !important
}

html .el-slider {
  --el-slider-height: 2px !important;
  --el-slider-button-size: 10px !important;
  --el-slider-button-wrapper-offset: -16px !important;
  --el-slider-main-bg-color: #000 !important;
  /* --el-slider-runway-bg-color: #ccc !important */
}
</style>